<template>
  <view class="bg-white margin-sm " style="border-radius: 10rpx;" >
  <view class="cu-item flex solid-bottom pr" @tap.stop="redirectUser">
    <view class="cu-avatar radius user-pic" :style="'background-image:url('+user.url+')'">
<!--      <view class="cu-tag badge"></view>-->
    </view>
    <view class="content" >
      <view>
        <view class="text-cut txt-name">{{user.name}}</view>
<!--        <view class="cu-tag round bg-orange sm"></view>-->
      </view>
      <view class="txt-phone">
        {{user.phone}}
      </view>
<!--      <view class="text-gray text-sm flex">-->
<!--        <view class="text-cut">{{user.parentName}}-->
<!--          <template v-if="user.parentName">-->
<!--          >>-->
<!--          </template>-->
<!--          {{user.remark || ''}}</view>-->
<!--      </view>-->
    </view>
    <view class="action pa">
      <view class="text-white zt" :class="['zt-'+ user.auditStatus]">{{user.auditStatusName|| ''}}</view>
<!--      <view class="text-gray">上级：</view>-->
    </view>
  </view>
  </view>

</template>

<script setup lang="ts">

import {onReachBottom, onLoad} from "@dcloudio/uni-app";
import {ref, onMounted, reactive, toRaw, computed} from "vue";

import {useStore} from "@/common/store";
import settingControl from "../../admin/src/router/modules/settingControl";
const store = useStore();

const userId = computed(() => store.userId)

interface Prop {
  user :{
    id: number
    username: string
    name: string
    phone : string
    email: string
    url: string
    parentId: number
    parentName: string
    ownerShopCount: number
    groupShopCount: number
    ownerShopLastTime: number
    auditStatus: number
    auditStatusName: string
    remark
    sex
  }
}

// 传递过来的参数
const props = defineProps<Prop>();

const redirectUser = ()=> {
  uni.navigateTo({
    url: `/pages/team/teamInfo?id=${props.user.id}`
  })
}

</script>


<style lang="scss" scoped>
.pr {
  position: relative;
  border-radius: 10rpx;
  .pa {
    position: absolute;
    top:36rpx;
    right: 28rpx;
    text-align: right;
    .zt-0{
      font-size: 26rpx;
      color: #577FDF;
      padding-bottom: 15rpx;
    }
    .zt-1{
      font-size: 26rpx;
      color: #2CBF3A;
      padding-bottom: 15rpx;
    }
    .zt--1{
      font-size: 26rpx;
      color: #FF4E56;
      padding-bottom: 15rpx;
    }
  }
  .content {
    padding-top: 35rpx;
    margin-left: 33rpx;
    .txt-name {
      font-size: 32rpx;
      color: #1D1D1D;
    }

    .txt-phone {
      font-size: 28rpx;
      color: #808080;
      margin-top: 30rpx;
    }
  }
  .user-pic{
    //margin-bottom: 27rpx;
    margin-top : 25rpx;
    margin-bottom: 25rpx;
    margin-left: 25rpx;
    width: 120rpx;
    height: 120rpx;
  }
}
</style>
